<template>
	<div class="game-container report-container">
		<Search
			v-model="searchData"
			:billDateList="billDateList"
			:activeName="activeName"
			@search="handleSearch"
			@reset="handleReset"
		/>
		<el-tabs v-model="activeName">
			<el-tab-pane label="团队账变" name="TeamAccountChanges">
				<TeamAccountChanges
					ref="TeamAccountChanges"
					v-if="activeName === 'TeamAccountChanges'"
					:searchData="searchData"
					:billDateList="billDateList"
				/>
			</el-tab-pane>
			<el-tab-pane label="团队收益" name="TeamBenefits">
				<TeamBenefits
					ref="TeamBenefits"
					v-if="activeName === 'TeamBenefits'"
					:searchData="searchData"
					:billDateList="billDateList"
				/>
			</el-tab-pane>
			<el-tab-pane label="异常注单" name="AbnormalBets">
				<AbnormalBets
					ref="AbnormalBets"
					v-if="activeName === 'AbnormalBets'"
					:searchData="searchData"
					:billDateList="billDateList"
				/>
			</el-tab-pane>
			<el-tab-pane label="异常账变" name="AbnormalAccountChanges">
				<AbnormalAccountChanges
					ref="AbnormalAccountChanges"
					v-if="activeName === 'AbnormalAccountChanges'"
					:searchData="searchData"
					:billDateList="billDateList"
				/>
			</el-tab-pane>
			<el-tab-pane label="本期重算注单" name="RecalcuBetOrdersPeriod">
				<RecalcuBetOrdersPeriod
					ref="RecalcuBetOrdersPeriod"
					v-if="activeName === 'RecalcuBetOrdersPeriod'"
					:searchData="searchData"
					:billDateList="billDateList"
				/>
			</el-tab-pane>
		</el-tabs>
	</div>
</template>

<script>
import Search from './components/Search/index'
import TeamAccountChanges from './components/TeamAccountChanges/index'
import TeamBenefits from './components/TeamBenefits/index'
import AbnormalBets from './components/AbnormalBets/index'
import AbnormalAccountChanges from './components/AbnormalAccountChanges/index'
import RecalcuBetOrdersPeriod from './components/RecalcuBetOrdersPeriod/index'
import dayjs from 'dayjs'
import list from '@/mixins/list'

export default {
  components: {
    Search,
    TeamAccountChanges,
    TeamBenefits,
    AbnormalBets,
    AbnormalAccountChanges,
    RecalcuBetOrdersPeriod
  },
  mixins: [list],
  data() {
    return {
      activeName: 'TeamAccountChanges',
      searchData: {
        merchantId: '',
        userType: 1,
        userName: '',
        billEndDate: ''
      },
      billDateList: []
    }
  },
  created() {
    this.getSettlementBillTimeList()
  },
  methods: {
    getSettlementBillTimeList() {
      this.loading = true
      const params = {
        pageNum: 1,
        pageSize: 200,
        periodType: 6
      }
      this.$api
        .proxyTeamBillPeriod(params)
        .then((res) => {
          this.loading = false
          if (res?.code === 200) {
            const { record } = res?.data
            this.billDateList = record
              .filter(item => item.billType != 0)
              .map(
                (item, index) => {
                  const startTime = dayjs(String(item.periodStDate)).format('YYYY-MM-DD') + ' 00:00:00'
                  const endTime = dayjs(String(item.periodEnDate)).format('YYYY-MM-DD') + ' 23:59:59'
                  return {
                    code: index,
                    description: `${startTime} 至 ${endTime}`,
                    periodStDate: item.periodStDate,
                    periodEnDate: item.periodEnDate,
                    periodStStr: startTime,
                    periodEnStr: endTime
                  }
                }
              )
            this.searchData.billEndDate = this.billDateList.length > 1 ? 0 : ''
          }
        })
        .catch(() => {
          this.loading = false
        })
    },
    handleSearch() {
      this.$refs[this.activeName].search()
    },
    handleReset() {
      this.searchData = {
        merchantId: '',
        userType: 1,
        userName: '',
        billEndDate: this.billDateList.length > 1 ? 0 : ''
      }
      this.$refs[this.activeName].reset()
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
